<!doctype html>
<html>

  <body>
    <div id="support"></div>

    <div>
      <h2>How to use this page</h2>
      <p>
        Add your required features and WebGL extensions to the GET query string like this<br>
        <a href="?require=webgl,canvas,css3d,svg&extensions=OES_standard_derivatives,OES_texture_float">?require=webgl,canvas,css3d,svg&extensions=OES_standard_derivatives,OES_texture_float</a>
      </p>
    </div>

    <script src="js/modernizr.custom.50520.js"></script>
    <script src="js/detect.js"></script>
    <script src="js/parseuri.js"></script>
    <script>
      <!--
      var reqStr = parseUri(location.toString()).queryKey.require;
      if (!reqStr) {
        reqStr = 'canvas,css3d,svg,webgl';
      }
      var reqs = decodeURIComponent(reqStr).toLowerCase().split(/\s*,\s*/);
      var elem = document.getElementById('support');

      var supported = true;

      for (var i=0; i<reqs.length; i++) {
        switch (reqs[i]) {
          case 'canvas': 
            supported = supported && GraphicsDetect.checkCanvas();
            elem.innerHTML += reqs[i] +': ' + GraphicsDetect.checkCanvas() + '<br>'; 
            break;
          case 'css3d': 
            supported = supported && GraphicsDetect.checkCSS3D();
            elem.innerHTML += reqs[i] +': ' + GraphicsDetect.checkCSS3D() + '<br>'; 
            break;
          case 'svg': 
            supported = supported && GraphicsDetect.checkSVG();
            elem.innerHTML += reqs[i] +': ' + GraphicsDetect.checkSVG() + '<br>'; 
            break;
          case 'webgl':
            break;
          default:
            supported = false;
            elem.innerHTML += reqs[i] +': ' + false + '<br>'; 
            break;
        }
      }

      if (reqs.indexOf('webgl') != -1) {

        var extStr = parseUri(location.toString()).queryKey.extensions;
        var extensions = [];
        if (extStr) {
          extStr = decodeURIComponent(extStr);
          extensions = extStr.split(/\s*,\s*/);
        }
        var ok = GraphicsDetect.checkWebGL(extensions);
        supported = supported && ok.supported;
        elem.innerHTML += 'webgl: ' + ok.webGL + '<br>';
        if (ok.supportedExtensions != null) {
          elem.innerHTML += 'supported extensions: ' + ok.supportedExtensions.join(', ') + '<br>';
        }
        if (ok.missingExtensions != null) {
          elem.innerHTML += 'missing extensions: ' + ok.missingExtensions.join(', ') + '<br>';
        }

      }

      elem.innerHTML = '<h1>'+(supported ? 'OK' : 'FAIL')+'</h1>' + elem.innerHTML;

      // -->
    </script>

  </body>

</html>
